﻿Vue.component('paginationbetter', {
    template: '<ul v-if="pageNumberList.length==0" class="pagination" style="display:none"></ul>' +
    '<template v-else>' +
    '<span class="total-count">共 {{pageTotal}} 页，总共 {{dataTotal}} 条</span>' +
    '<ul class="pagination">' +
    '<li :class="[\'previous\', pageNumber === 1 ? \'disabled\' : \'\']" @click="prevPage()">' +
    '<i></i>' +
    '</li>' +
    '<li  v-for="number in pageNumberList" track-by="$index" :class="{current: pageNumber === number, ellipsis: number === \'...\'}" @click="turnPage(number)" v-text="number"></li>' +
    '<li :class="[\'previous\', pageNumber === pageTotal ? \'disabled\' : \'\']" @click="nextPage()">' +
    '<i></i>' +
    '</li>' +
    '</ul>' +
    '<div class="turn-operater">' +
    '<span>' +
    '跳转到' +
    '<input class="go-number" type="text" v-model="goNumber" v-on:blur="correct($event)"/>' +
    '</span>' +
    '<span class="go-button" v-on:click="turnPage(goNumber)">GO</span>' +
    '</div>' +
    '</template>',
    props: {
        dataTotal: {
            type: Number,
            default: 0,
        },
        pageNumber: {
            twoWay: true,
            type: Number,
            default: 1
        },
        pageSize: {

            type: Number,
            default: 10
        },
        dataNumber: {
            twoWay: true,
            type: Number,
            default: 0
        },
        ajaxFn: Function
    },
    ready: function () {
        if (vm != undefined && typeof vm.PageSearch === 'function' && vm.PageSearch !== undefined) {
            vm.PageSearch();
        }
    },
    computed: {
        pageTotal: function () {
            return Math.ceil(this.dataTotal / this.pageSize);
        },
        dataNumber: function () {
            return this.pageSize * (this.pageNumber - 1);
        },
        pageNumberList: function () {
            var total = this.pageTotal,
                current = this.pageNumber,
                i = 1,
                end = total,
                pageNumberList = [];
            if (total === 0) {
                return pageNumberList;
            }
            if (total > 7) {
                if (current <= 4) {
                    end = 6;
                    for (; i <= end; i++) {
                        pageNumberList.push(i);
                    }
                    pageNumberList.push('...');
                    pageNumberList.push(total);
                } else if (end - current < 4) {
                    pageNumberList.push(1);
                    pageNumberList.push('...');
                    i = end - 5;
                    for (; i <= end; i++) {
                        pageNumberList.push(i);
                    }
                } else {
                    pageNumberList.push(1);
                    pageNumberList.push('...');
                    i = current - 2;
                    end = current + 2;
                    for (; i <= end; i++) {
                        pageNumberList.push(i);
                    }
                    pageNumberList.push('...');
                    pageNumberList.push(total);
                }
            } else {
                for (; i <= end; i++) {
                    pageNumberList.push(i);
                }
            }
            return pageNumberList;
        }
    },
    methods: {
        //校验数字
        correct: function (e) {
            if (e.target.value === '') {
                return;
            }
            // 如果value不能解析成数字，则设置为空
            if (isNaN(parseFloat(e.target.value))) {
                this.goNumber = '';
                return;
            }
            // 最小输入1
            if (this.goNumber < 1) {
                this.goNumber = 1;
                return;
            }
            //最大为 pageTotal
            if (this.goNumber > this.pageTotal) {
                this.goNumber = this.pageTotal;
            }
        },
        prevPage: function () {
            debugger;
            if (this.pageNumber === 1) {
                return;
            }
            this.turnPage(this.pageNumber - 1);
        },
        nextPage: function () {
            debugger;
            if (this.pageNumber === this.pageTotal || this.pageTotal === 0 || this.dataTotal === 0) {
                return;
            }
            this.turnPage(this.pageNumber + 1);
        },
        turnPage: function (num) {
            debugger;
            //翻页操作默认执行PageSearch()方法，可以传入方法，来访问其他接口
            //if (typeof num === "string") {
            //    return;
            //}
            //if (num === this.pageNumber) return;
            var num = parseInt(num);
            this.pageNumber = num;
            if (this.ajaxFn != undefined && typeof this.ajaxFn === 'function') {
                this.ajaxFn();
            } else {
                if (vm != undefined && typeof vm.PageSearch === 'function' && vm.PageSearch !== undefined) {
                    vm.PageSearch();
                }
            }
        },
        ajaxHandler: function (ajaxObj, num) {
            if (this.ajaxFn != undefined && typeof this.ajaxFn === 'function') {
                this.ajaxFn();
            } else {
                if (vm != undefined && typeof vm.PageSearch === 'function' && vm.PageSearch !== undefined) {
                    vm.PageSearch();
                }
            }
        }
    }
});